<template>
  <swiper>
    <swiper-item v-for="(item,index) in banners" :key="index">
      <img :src="item.image" alt="">
    </swiper-item>
  </swiper>
</template>

<script>
import Swiper from '../../components/Swiper/Swiper.vue'
import SwiperItem from '../../components/Swiper/SwiperItem.vue'

export default {
  components: { Swiper, SwiperItem },
  name: '',
  data () {
    return {
      banners:[
        {
          image:require('../../assets/img/home/banners/banner1.jpg')
        },
        {
          image:require('../../assets/img/home/banners/banner2.jpg')
        },{
          image:require('../../assets/img/home/banners/banner3.jpg')
        },{
          image:require('../../assets/img/home/banners/banner4.jpg')
        }
      ]
    }
  },
  methods:{
  
}
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>